import '../../../public.dart';

class CommonStepIndicator extends StatelessWidget {
  final int currentStep;
  final List<String> stepTitles;
  final Color? activeColor;
  final Color? inactiveColor;
  final Color? textColor;

  const CommonStepIndicator({
    super.key,
    required this.currentStep,
    required this.stepTitles,
    this.activeColor = const Color(0xFF1DE9B6),
    this.inactiveColor = const Color(0xFFE0E0E0),
    this.textColor = Colors.black87,
  });

  @override
  Widget build(BuildContext context) {
    final stepCount = stepTitles.length;

    return Row(
      children: List.generate(
        stepCount,
        (index) => _buildStepItem(index, stepCount),
      ),
    );
  }

  Widget _buildStepItem(int index, int stepCount) {
    final isActive = currentStep >= index + 1;
    final isLast = index == stepCount - 1;

    return Expanded(
      child: Column(
        children: [
          Row(
            children: [
              Container(
                width: 32,
                height: 32,
                decoration: BoxDecoration(
                  color: isActive ? activeColor : inactiveColor,
                  shape: BoxShape.circle,
                ),
                child: Center(
                  child: Text(
                    '${index + 1}',
                    style: TextStyle(
                      color: isActive ? Colors.white : Colors.grey[600],
                      fontSize: 14,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                ),
              ),
              if (!isLast) ...[
                const SizedBox(width: 8),
                Expanded(
                  child: Container(
                    height: 2,
                    color: currentStep > index + 1 ? activeColor : inactiveColor,
                  ),
                ),
                const SizedBox(width: 8),
              ],
            ],
          ),
          const SizedBox(height: 8),
          Text(
            stepTitles[index],
            style: TextStyle(
              color: isActive ? textColor : Colors.grey[600],
              fontSize: 11,
              fontWeight: FontWeight.w500,
            ),
            textAlign: TextAlign.center,
            maxLines: 2,
            overflow: TextOverflow.ellipsis,
          ),
        ],
      ),
    );
  }
}